<template>
	<view class="container" >
		<!-- 积分背景图 -->
		<view class="jifen_bg">
			<view>
				<view class="my_jf">我的积分</view>
				<view class="jf_sz">{{money}}</view>
			</view>
		</view>
		<!-- 积分账单 -->
		<view class="jf_dh">积分账单</view>
		<!-- 账单详情 -->
		<view class="bill-box">
			<view class="bill-title">
				<view class="left">收益时间</view>
				<view class="middle">来源</view>
				<view class="right">数量</view>
			</view>
			<view class="bill-item" v-for="item in billList">
				<view class="left">{{$u.timeFormat(item.createTime, 'yyyy-mm-dd hh:MM')}}</view>
				<view class="middle">{{item.describe}}</view>
				<view class="right upnum"><text>{{item.remark}}</text>{{item.value}}</view>
			</view>
		</view>
	</view>
</template>
<script>
	import {getPageTask} from "../../../api/user.js"
	export default{
		data(){
			return{
				billList:[],
				money:'',
				type:1
			}
		},
		onLoad(e) {
			if(e.type){
				uni.setNavigationBarTitle({
				    title: '释放积分'
				});
				this.type=3
			}
			this.getbillList();
			this.time = this.$u.timeFormat(this.timestamp, 'yyyy-mm-dd hh:MM');
		},
		onReachBottom() {
			this.getbillList()
		},
		methods:{
			getbillList(){
				this.get(getPageTask,{type:this.type,pageNum:1,pageSize:20}).then(res=>{
					console.log(res)
					// this.billList=res.data.accountList.list
					this.billList=[...this.billList,...res.data.accountList.list]
					this.money=res.data.money;
				})
			}
		}
	}
</script>

<style>
	.container {
		width: 750rpx;
		background: #FFFFFF;
		opacity: 1;
		padding: 0 30rpx;
	}
	
	.jifen_bg {
		margin-top: 30rpx;
		text-align: center;
		/* width: 750rpx; */
		height: 240rpx;
		background-image: url(../../../static/user/yun/yuntuan_bg.png);
		background-size: 690rpx 240rpx;
		background-repeat: no-repeat;
		background-position: center;
		align-items: center;
		display: flex;
		justify-content: space-between;
	
	}
	
	.my_jf {
		margin-left: 30rpx;
		font-size: 28rpx;
		color: #F6F6F6;
		opacity: 1;
		font-family: PingFang SC;
		font-weight: 400;
		text-align: left;
	}
	
	.jf_zd {
		font-size: 22rpx;
		color: #333333;
		width: 130rpx;
		height: 48rpx;
		border-radius: 27rpx;
		background-color: #FFFFFF;
		text-align: center;
		line-height: 48rpx;
		font-family: PingFang SC;
		font-weight: 400;
		margin-right: 60rpx;
	}
	
	.jf_sz {
		// width: 112rpx;
		// height: 78rpx;
		// text-align: center;
		margin-left: 30rpx;
		font-size: 70rpx;
		color: #F6F6F6;
		font-family: Arial;
		font-weight: 400;
		text-align: left;
		margin-top: 20rpx;
	}
	
	.jf_dh {
		width: 160rpx;
		/* height: 56px; */
		font-size: 40rpx;
		font-family: PingFang SC;
		font-weight: bold;
		line-height: 56rpx;
		color: #333333;
		opacity: 1;
		margin-top: 40rpx;
	}
	.bill-box{
		width: 100%;
		margin-top: 40rpx;
		font-size: 30rpx;
		color: #666666;
	}
	.bill-title{
		display: flex;
		justify-content: space-between;
	}
	.left{
		width: 35%;
	}
	.middle{
		width: 50%;
		text-align: center;
	}
	.right{
		width: 15%;
		text-align: right;
	}
	.bill-item{
		display: flex;
		justify-content: space-between;
		font-size: 28rpx;
		margin: 30rpx 0;
	}
	.upnum{
		color: #F0812D;
	}
	.dowmnum{
		color: #2AAB26;
	}
</style>
